import React, { useState, useEffect } from 'react'
import './css/shoucang.scss'
import IconFont from './Tubiao';
import { useNavigate } from 'react-router-dom';
import { Sticky, Cell, ProductCard } from 'react-vant';
import { InfiniteScroll } from 'antd-mobile'
import axios from 'axios';
export default function Shoucang() {
    const navigate = useNavigate()
    let [data, setData] = useState([
        { id: '123', title: '话剧【恋爱中的犀牛】', addren: '北京今日美术馆', time: '2020.09.10-2020.10.09', img: "", price: '999' },
        { id: '12', title: '肖邦协奏曲音乐会', addren: '北京今日美术馆', time: '2020.09.10-2020.10.09', img: "", price: '999' },
        { id: '13', title: '音乐剧【仲夏夜之梦】', addren: '北京今日美术馆', time: '2020.09.10-2020.10.09', img: "", price: '999' }
    ])

    let getDate = async () => {
        let { data } = await axios.get('ping')
        setData(data)
    }
    useEffect(() => {
        // getDate()
    }, [])
    return (
        <div className='div'>
            <Sticky>
                <div className='top'>
                    <span className='icon' onClick={() => (navigate('/app/my'))}>
                        <IconFont name='icon-arrowLeft'></IconFont>
                    </span>
                    <span>我的收藏</span>
                </div>
            </Sticky>
            <div className='neirong'>
                {data.map((item, index) => {
                    return (
                        <div key={index}>
                            <ProductCard
                                key={index}
                                price={item.price}
                                desc={`${item.time}`}
                                tags={`${item.addren}`}
                                title={item.title}
                                thumb="../1.png"
                            />
                        </div>
                    )
                })}
            </div>
            <InfiniteScroll hasMore={false} />
        </div>
    )
}
